;(function ($, global) {
  let _token = $('input[name=_token]').eq(0).val()
  let $addModal = $('#menu-add-modal')
  let $editModal = $('#menu-edit-modal')

  let $addForm = $('#menu-add-form')
  let $addReset = $('#menu-add-reset')
  let $addSubmit = $('#menu-add-submit')

  let $editForm = $('#menu-edit-form')
  let $editReset = $('#menu-edit-reset')
  let $editSubmit = $('#menu-edit-submit')

  let $btnSubmits = $('.modal .submit')
  let $addSpan = $('.add-span')
  let $editSpan = $('.edit-span')
  let $delSpan = $('.del-span')

  let verifyAdd = {
    title: {
      required: true,
      errMsg: '菜单名称不能为空'
    },
    url: {
      required: true,
      errMsg: '菜单路径不能为空'
    },
    pid: {
      required: true,
      errMsg: '必须有父级菜单'
    }
  }

  let verifyEdit = {
    id: {
      required: true,
      errMsg: '菜单id必须'
    },
    title: {
      required: true,
      errMsg: '菜单名称不能为空'
    },
    url: {
      required: true,
      errMsg: '菜单路径不能为空'
    },
    pid: {
      required: true,
      errMsg: '必须有父级菜单'
    }
  }

  let initAddReq = function ($form) {
    return {
      _token: $form.find('input[name=_token]').val(),
      title: $form.find('input[name=title]').val(),
      pid: $form.find('select[name=pid]').val(),
      url: $form.find('input[name=url]').val(),
      icon: $form.find('input[name=icon]').val(),
      rank: $form.find('input[name=rank]').val(),
      status: $form.find('input[name=status]:checked').val(),
      isshow: $form.find('input[name=isshow]:checked').val()
    }
  }

  let initEditReq = function ($form) {
    return {
      _token: $form.find('input[name=_token]').val(),
      id: $form.find('input[name=id]').val(),
      title: $form.find('input[name=title]').val(),
      pid: $form.find('select[name=pid]').val(),
      url: $form.find('input[name=url]').val(),
      icon: $form.find('input[name=icon]').val(),
      rank: $form.find('input[name=rank]').val(),
      status: $form.find('input[name=status]:checked').val(),
      isshow: $form.find('input[name=isshow]:checked').val()
    }
  }

  let initAddForm = function ($span, $form) {
    $form.find('select[name=pid]').val($span.attr('data-id'))
  }

  let initEditForm = function ($span, $form) {
    $form.find('input[name=id]').val($span.attr('data-id'))
    $form.find('input[name=title]').val($span.attr('data-title'))
    $form.find('input[name=url]').val($span.attr('data-url'))
    $form.find('input[name=rank]').val($span.attr('data-rank'))
    $form.find('input[name=icon]').val($span.attr('data-icon'))
    $form.find('select[name=pid]').val($span.attr('data-pid'))
    let status = $span.attr('data-status')
    let isshow = $span.attr('data-isshow')
    $form.find("input[name='status'][value='" + status + "']").prop('checked', 'checked')
    $form.find("input[name='isshow'][value='" + isshow + "']").prop('checked', 'checked')
  }

  let reset = function ($form) {
    $form[0].reset()
  }

  let trigger = function () {
    $addReset.click(function () {
      reset($addForm)
    })

    $editReset.click(function () {
      reset($editForm)
    })

    $addSubmit.click(function () {
      let req = initAddReq($addForm)
      console.log(req)
      if (reqVerify(req, verifyAdd)) {
        btnDisable($(this))
        loading()
        addAjax(req, addSuccess, addError)
      }
    })

    $editSubmit.click(function () {
      let req = initEditReq($editForm)
      if (reqVerify(req, verifyEdit)) {
        btnDisable($(this))
        loading()
        editAjax(req, editSuccess, editError)
      }
    })

    $addSpan.click(function () {
      $span = $(this)
      initAddForm($span, $addForm)
    })

    $editSpan.click(function () {
      $span = $(this)
      initEditForm($span, $editForm)
    })

    $delSpan.click(function () {
      $span = $(this)
      let id = $span.attr('data-id')
      let data = {
        id: id,
        s: 1,
        _token: _token
      }
      fnDelConfirm(data)
    })
  }

  let fnDelConfirm = function (data) {
    layer.confirm('确定删除此项？', {
      btn: ['确定', '取消'] // 按钮
    }, function () {
      fnLoading()
      fnDelMenu(data, fnDelSuccess, fnDelError)
    }, function () {})
  }

  let fnDelSuccess = function (data) {
    layer.msg('删除成功', {icon: 1})
    $('#menu-' + data.id).fadeTo('slow', 0.01, function () { // fade
      $(this).slideUp('slow', function () { // slide up
        $(this).remove()
      })
    })
  }

  let fnDelError = function () {}

  let fnDelMenu = function (data, suc, err) {
    fnApiAjax('POST', 'usermenu/del', data, 'json', suc, err)
  }

  let addAjax = function (data, suc, err) {
    api_ajax('POST', 'usermenu/add', data, 'json', suc, err)
  }

  let addSuccess = function (data) {
    fnAjaxFinish()
    reset($addForm)
    $addModal.modal('hide')
    layer.msg('新增成功')
    fnReload()
  }

  let addError = function (data) {
    fnAjaxFinish()
  }

  let fnAjaxFinish = function () {
    stopLoading()
    btnAble()
  }

  let editAjax = function (data, suc, err) {
    api_ajax('POST', 'usermenu/edit?id=' + data.id, data, 'json', suc, err)
  }

  let editSuccess = function (data) {
    fnAjaxFinish()
    reset($editForm)
    $editModal.modal('hide')
    layer.msg('修改成功')
    fnReload()
  }

  let editError = function (data) {
    fnAjaxFinish()
  }

  let loading = function () {
    layer.load(2)
  }
  let stopLoading = function () {
    layer.closeAll('loading')
  }
  let btnDisable = function ($btn) {
    $btn.attr('disabled', 'disabled')
  }
  let btnAble = function () {
    $btnSubmits.removeAttr('disabled')
  }

  let fnReload = function () {
    setTimeout(function() {
      window.location.reload()
    },500);
  }
  trigger()
})(jQuery, window)


;(function ($, global) { // 菜单列表项的下拉
  let $table = $('table#menu-table')
  let $parent = $table.find('.parent-menu')
  let $down = $parent.find('td.down')
  let id = null
  let $children = null
  let trigger = function () {
    $down.click(function () {
      $this = $(this)
      $thisSpan = $this.find('span')
      $thisParent = $this.parent()
      id = $thisParent.attr('data-id')
      let isdown = $thisParent.attr('data-isdown')
      $children = $table.find('tr[data-pid=' + id + ']')
      if (isdown == 0) {
        $children.show()
        // $(selector).slideDown()
        $thisParent.attr('data-isdown', 1)
        $thisSpan.removeClass().addClass('fa fa-fw fa-angle-down')
      }else {
        $children.hide()
        $thisParent.attr('data-isdown', 0)
        $thisSpan.removeClass().addClass('fa fa-fw fa-angle-right')
      }
    })
  }
  trigger()
}(jQuery, window))